<template>
	<view class="content">
		
		<view class="dataBox" v-for="(item,index) in dataList" :key="index" v-show="item.show">
			<image class="goodsImage" :src="item.cover" mode=""></image>
			<view class="goodsRight">
				<view class="goodsName overflow_two fontSize15">{{item.name}}</view>
				<view class="ruleBox fontSize12">{{item.colNumber}}人收藏</view>
				<view class="clearBoth"></view>
				<view class="priceBox">
					<view class="price fontSemiBold">¥{{item.price}}</view>
					<view class="colBtn fontSize13" @tap="btnFalse(item.id,index)">取消收藏</view>
					<view class="clearBoth"></view>
				</view>
				<view class="clearBoth"></view>
			</view>
			<view class="clearBoth"></view>
		</view>

		
		
		
		
	</view>
</template>
<style>
	.content{min-height: 100vh;background: rgb(244,244,248);padding-top:2upx}
	.content .dataBox{width: 90%;padding:5% 2%;margin-left: 5%;margin-top: 40upx;border-radius: 10upx;background: white;}
	.content .dataBox .goodsImage{width:180upx;height: 180upx;border-radius: 10upx;float: left;margin-right: 5%;}
	.content .dataBox .goodsRight{width: 65%;height:180upx;float: left;position: relative;}
	.content .dataBox .goodsRight .goodsName{height:80upx}
	.content .dataBox .goodsRight .ruleBox{color:#999999;float: left;margin:0upx 0 0 0}
	.content .dataBox .goodsRight .priceBox{width: 100%;position: absolute;bottom: -10upx;left:0;}
	.content .dataBox .goodsRight .priceBox .price{color:#262626;font-size: 40upx;float: left;}
	.content .dataBox .goodsRight .priceBox .colBtn{height:50upx;line-height: 50upx;margin-top: 10upx;padding:0 10upx;border-radius: 10upx;color:#262626;float: right;border:2upx solid #CCCCCC}
</style>
<script>
	import Share from '@/common/wx_share.js'
	export default {
		data() {
			return {
				share:{
					title:"",
					path:'/pages/tabbar/index',
					imageUrl:'',
					desc:'',
					content:''
				},
				dataList:[
					// {id:1,show:true,cover:"/static/del/del_9.png",name:"商品名字",price:10,colNumber:10},
					// {id:2,show:true,cover:"/static/del/del_9.png",name:"商品名字",price:10,colNumber:12},
				],
				pages:1,
		
				
			}
		},
		onLoad(){
			this.AjaxLoad()
		},
		onReachBottom(){
			this.pages++
			this.AjaxLoad()
		},
		methods: {
			AjaxLoad(){
				var dataList = []
				let param={
					token:this._$userToken("userInfo").token,
					// token:"61a37939e67454853f97d91b33bed0279fb36d0d",
					page:this.pages,
					filter:1
				};
				this._$InitRequest.request("MemberColl/shoucanglst", param).then(res => {
					res.data.forEach( (item) =>{
						dataList.push({
							id:item.id,
							show:true,
							cover:item.thumb_url,
							name:item.goods_name,
							price:item.zs_price,
							colNumber:item.coll_num
						})
					})
					for (var i = 0; i < dataList.length; i++){this.dataList.push( dataList[i] )}
					
					
				},error=>{})
			},
			btnFalse(id,index){
				let param={
					token:this._$userToken("userInfo").token,
					// token:"61a37939e67454853f97d91b33bed0279fb36d0d",
					goods_id:id
				};
				this._$InitRequest.request("CollGoods/cancelcoll", param).then(res => {
					uni.showToast({title:res.mess,icon:"none"})
					this.dataList[index].show = false
				},error=>{})
			}
			
			
		}
	}
</script>
<style lang="scss" scoped>
/deep/ .uni-input-input {font-size:32upx}
/deep/ .uni-radio-input-checked{background-color:rgb(110,43,34) !important;border:2upx solid white !important}
.content .html{
  ::v-deep {
    img {
      width: 100%;
    }
  }
}
</style>